<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
	<title>VAOI REGISTRO</title>
	<meta name="content-type" content="text/html; charset=UTF-8" />

	<link
		href="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/css/bootstrap.min.css"
		rel="stylesheet" type="text/css" />
	<link
		href="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/css/login.css"
		rel="stylesheet" type="text/css" />
	<link
		href="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/css/formvalidation/formValidation.min.css"
		rel="stylesheet" type="text/css" />
	<link
		href="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/css/font-awesome.css"
		rel="stylesheet" type="text/css" />

	<script
		src="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/js/jquery.min.js"
		type="text/javascript"></script>
	<script
		src="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/js/bootstrap.min.js"
		type="text/javascript"></script>
	<script
		src="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/js/formValidation.min.js"
		type="text/javascript"></script>
	<script
		src="#{facesContext.externalContext.request.scheme}://#{facesContext.externalContext.request.serverName}:#{facesContext.externalContext.request.serverPort}#{facesContext.externalContext.request.contextPath}/js/framework/bootstrap.min.js"
		type="text/javascript"></script>

</h:head>

<h:body>

	<div class="container">

		<div class="omb_login">
			<h3 class="omb_authTitle">Registrar Usuario</h3>

			<div class="row omb_row-sm-offset-3 omb_loginOr">
				<div class="col-xs-12 col-sm-6">
					<hr class="omb_hrOr" />
					<span class="omb_spanOr">o</span>
				</div>
			</div>

			<div class="row omb_row-sm-offset-3">
				<div class="col-xs-12 col-sm-6">
					<h:form id="regexpEmailForm" autocomplete="off">

						<p:messages id="messages" autoUpdate="true" closable="true" />

						<div class="form-group">
							<div class="input-group">
								<span class="input-group-addon"><i class="fa fa-list-alt"></i></span>
								<p:inputText class="form-control" name="nombres"
									value="#{usuariosView.txtNombre}"
									placeholder="Nombre(s) y Apellido(s)" required="true"
									requiredMessage="El nombre es Requerido" />
							</div>
						</div>
						<span class="help-block"></span>

						<div class="form-group">
							<div class="input-group">
								<span class="input-group-addon"><i
									class="fa fa-envelope-o"></i></span>
								<p:inputText class="form-control" name="email" id="email"
									value="#{usuariosView.txtEmail}" placeholder="Correo"
									required="true" validatorMessage="Email invalido"
									requiredMessage="El email es requerido">
									<f:validateRegex
										pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$" />

								</p:inputText>

							</div>
						</div>
						<span class="help-block"></span>

						<div class="input-group">
							<span class="input-group-addon"><i class="fa fa-lock"></i></span>
							<p:password class="form-control" name="password"
								value="#{usuariosView.txtClave}"
								placeholder="Confirmar Contraseña" required="true"
								requiredMessage="La contraseña es Requerida" />
						</div>
						<span class="help-block"></span>

						<br />
						<div class="input-group">
							<span class="input-group-addon"><i class="fa fa-lock"></i></span>

							<p:password class="form-control" name="password2"
								value="#{usuariosView.txtClave2}"
								placeholder="Confirmar Contraseña" required="true"
								requiredMessage="La confirmacion de la contraseña es Requerida" />
						</div>
						<span class="help-block"></span>

						<br />
						<p:commandButton class="btn btn-primary btn-block"
							value="Registrar" action="#{usuariosView.registroUsuario}" />
					</h:form>

				</div>
			</div>
			<br />

		</div>

	</div>

</h:body>
</html>